rootWrapper.style.opacity = 1;
rootLoading.style.opacity = 0;
let login = document.getElementById("login");

document.querySelectorAll(".login-content").forEach((content, id) => 
    {
        let input = content.querySelector(".login-content-input");
        content.addEventListener("click", () =>
            {
                input.focus();
            });
    });

document.getElementById("login-content-name").addEventListener("input", function()
    {
            document.getElementById("login-name-hint").textContent = "";
    });

document.getElementById("login-content-toggle").addEventListener("click", function()
    {
        let input = this.parentNode.querySelector(".login-content-input");
        if (input.type === "password")
        {
            input.type = "text";
            this.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512"><path d="M432 448a15.92 15.92 0 0 1-11.31-4.69l-352-352a16 16 0 0 1 22.62-22.62l352 352A16 16 0 0 1 432 448z" fill="currentColor"></path><path d="M255.66 384c-41.49 0-81.5-12.28-118.92-36.5c-34.07-22-64.74-53.51-88.7-91v-.08c19.94-28.57 41.78-52.73 65.24-72.21a2 2 0 0 0 .14-2.94L93.5 161.38a2 2 0 0 0-2.71-.12c-24.92 21-48.05 46.76-69.08 76.92a31.92 31.92 0 0 0-.64 35.54c26.41 41.33 60.4 76.14 98.28 100.65C162 402 207.9 416 255.66 416a239.13 239.13 0 0 0 75.8-12.58a2 2 0 0 0 .77-3.31l-21.58-21.58a4 4 0 0 0-3.83-1a204.8 204.8 0 0 1-51.16 6.47z" fill="currentColor"></path><path d="M490.84 238.6c-26.46-40.92-60.79-75.68-99.27-100.53C349 110.55 302 96 255.66 96a227.34 227.34 0 0 0-74.89 12.83a2 2 0 0 0-.75 3.31l21.55 21.55a4 4 0 0 0 3.88 1a192.82 192.82 0 0 1 50.21-6.69c40.69 0 80.58 12.43 118.55 37c34.71 22.4 65.74 53.88 89.76 91a.13.13 0 0 1 0 .16a310.72 310.72 0 0 1-64.12 72.73a2 2 0 0 0-.15 2.95l19.9 19.89a2 2 0 0 0 2.7.13a343.49 343.49 0 0 0 68.64-78.48a32.2 32.2 0 0 0-.1-34.78z" fill="currentColor"></path><path d="M256 160a95.88 95.88 0 0 0-21.37 2.4a2 2 0 0 0-1 3.38l112.59 112.56a2 2 0 0 0 3.38-1A96 96 0 0 0 256 160z" fill="currentColor"></path><path d="M165.78 233.66a2 2 0 0 0-3.38 1a96 96 0 0 0 115 115a2 2 0 0 0 1-3.38z" fill="currentColor"></path></svg>`;
        }
        else
        {
            input.type = "password";
            this.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512"><path d="M255.66 112c-77.94 0-157.89 45.11-220.83 135.33a16 16 0 0 0-.27 17.77C82.92 340.8 161.8 400 255.66 400c92.84 0 173.34-59.38 221.79-135.25a16.14 16.14 0 0 0 0-17.47C428.89 172.28 347.8 112 255.66 112z" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32"></path><circle cx="256" cy="256" r="80" fill="none" stroke="currentColor" stroke-miterlimit="10" stroke-width="32"></circle></svg>`;
        }
    });

    document.getElementById("login-content-password").addEventListener("input", function()
        {
                document.getElementById("login-password-hint").textContent = "";
        });

let loginCheck = false;
document.getElementById("login-checkbox-align").addEventListener("click", function()
    {
        if (this.hasAttribute("style"))
        {
            loginCheck = false;
            this.removeAttribute("style");
        }
        else
        {
            loginCheck = true;
            document.getElementById("login-check-hint").textContent = "";
            this.setAttribute("style", "box-shadow: inset 0 0 0 1px rgb(77 107 254); background-color: rgb(77 107 254); color: #F8FAFF;");
        }
    });

    
document.getElementById("login-button").addEventListener("click", function()
{
    let err = false;
    let loginName = document.getElementById("login-content-name").value;
    if (loginName === "")
    {
        err = true;
        document.getElementById("login-name-hint").textContent = "请输入用户名";
    }
    
    let loginPassword = document.getElementById("login-content-password").value;
    if (loginPassword === "")
    {
        err = true;
        document.getElementById("login-password-hint").textContent = "请输入密码";
    }
    
    if (!loginCheck)
    {
        err = true;
        document.getElementById("login-check-hint").textContent = "请阅读并同意协议";
    }

    if (err)
        return;

    fetch("/ai/login", 
        { 
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({ name: loginName, password: sha256.sha256(loginPassword) })
        })
    .then(response => 
        {
            if (response.ok)
                return response.text();
            else
                throw new Error("Network response was not ok");
        })
    .then(dataJson => 
         {
            let data = JSON.parse(dataJson);
            if (data.ec)
            {
                document.getElementById("login-name-hint").textContent = "用户名或密码错误";
                document.getElementById("login-password-hint").textContent = "用户名或密码错误";
                return;
            }

            user = data.user;
            user.name = loginName;
            localStorage.setItem("user", JSON.stringify(user));
            login.style.pointerEvents = "none";
            winLoadChat();
         })
    .catch(error => console.error("login-button error:", error));
});